<template>
	<div>
		<v-sidebar />
		<div class="content-box" :class="{ 'content-collapse': sidebar.collapse }">
			<v-header />
			<v-tags></v-tags>
				<div class="content">
					<router-view v-slot="{ Component }">
						<transition name="el-fade-in-linear" mode="out-in">
							<keep-alive :include="tags.nameList">
								<component :is="Component"></component>
							</keep-alive>
						</transition>
					</router-view>
				</div>
		</div>
	</div>
</template>
<script setup lang="ts">
import { useSidebarStore } from '@/store/sidebar';
import { useTagsStore } from '@/store/tags';
import vHeader from '@/components/header.vue';
import vFooter from '@/components/footer.vue';
import vSidebar from '@/components/sidebar.vue';
import vTags from '@/components/tags.vue';
const sidebar = useSidebarStore();
const tags = useTagsStore();
</script>
